import React from 'react';
import { Select } from 'antd';
import { formatMessage } from 'umi';
import classNames from 'classnames';
import Text from './_components/Text';
import styles from './index.less';

const Index = (props) => {
  const {
    placeholder = formatMessage({ id: '请选择' }), // 选择框默认文字
    showSearch = true, // 使单选模式可搜索
    filterOption = (inputValue, option) => `${option.props.children}`.indexOf(inputValue) !== -1, // 是否根据输入项进行筛选。当其为一个函数时，会接收 inputValue option 两个参数，当 option 符合筛选条件时，应返回 true，反之则返回 false

    separator,

    value,
    onChange,
    disabled,

    ...rest
  } = props;

  const newValue = separator ? value?.split(separator) : value;

  const newOnChange = (v) => {
    if (onChange) {
      onChange(separator ? v?.join(separator) : v);
    }
  };

  if (!Object.keys(props).includes('value')) {
    return 'DEPRECATED';
  }

  if (disabled && disabled.render) {
    const newOptions =
      props.options ||
      React.Children.map(props.children, (item) => {
        if (item) {
          const itemProps = item.props;
          return { value: itemProps.value, label: itemProps.children };
        }
        return undefined;
      });
    return <Text value={newValue} options={newOptions} render={disabled.render} />;
  }

  return (
    <span className={classNames(styles.col24, styles.componentWrapper)}>
      <Select
        virtual={false}
        allowClear
        placeholder={placeholder}
        showSearch={showSearch}
        filterOption={filterOption}
        {...rest}
        disabled={!!disabled}
        value={newValue}
        onChange={newOnChange}
      />
    </span>
  );
};

Object.keys(Select).forEach((item) => {
  if (!['defaultProps', 'propTypes'].includes(item)) {
    Index[item] = Select[item];
  }
});
Index.displayName = 'Select';
export default Index;
